<template>
  <div id="wrapper">
    <el-select 
    v-bind="$attrs"
    v-on="$listeners"
    :value-key="signData.id"
    placeholder="请选择"
    @visible-change="loadData"
  >
      <el-option
        v-for="(item, index) in options"
        :key="item[signData.id]"
        :label="item[signData.label]"
        :value="signData.value ? item : item[signData.value]">
      </el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  name: 'StoreSelectCompN',
  props: ['signData'],
  inject: ['store'],
  methods: {
    async loadData(val){
      try {
        if(this.store && val){
          await this.store.loadData()          
          this.options = this.store.data     
        }
      } catch (error) {
        console.log(error);
      }
    }
  },
  data() {
    return {
      options: [],
      value: ''
    }
  },
}
</script>